import { Flex } from "antd"
import { Navigate, Route, Routes } from "react-router"
import { Issue } from "../../pages/issue"
import { Book } from "../../pages/book"
import { Qa } from "../../pages/qa"
import { Home } from "../../pages/home"
import { IssueDetail } from "../../pages/issueDetail"
import { IssueEdit } from "../../pages/issueEdit"
import { RouterAuth } from "../RouterAuth"
import { Search } from "../../pages/search"
const style:React.CSSProperties = {
    //最小高度
    
    minHeight:"calc(100vh - 100px - 100px)",
    width:"80%",
    margin:"0 auto"
}
export const Content = ()=>{
    return (
        <>
            <Flex style={style} vertical>
                <Routes>
                    <Route path="/" element={<Navigate to="/issue"></Navigate>}></Route>
                    <Route path="/issue" element={<Issue></Issue>}></Route>
                    <Route path="/book" element={<Book></Book>}></Route>
                    <Route path="/qa" element={<Qa></Qa>}></Route>
                    <Route path="/home" element={<RouterAuth><Home></Home></RouterAuth>}></Route>
                    <Route path="/issue/:id" element={<IssueDetail></IssueDetail>}></Route>
                    <Route path="/editissue" element={<IssueEdit></IssueEdit>}></Route>
                    <Route path="/search" element={<Search></Search>}></Route>
                </Routes>
            </Flex>
        </>
    )
}